import React from 'react';
import { View, Text, StyleSheet, ViewStyle } from 'react-native'
import { ShortBar, InfoLayout } from 'components'
import { PosCustomer } from 'api/pos';
import { commonStyle, translateSize, definedColors } from 'styles'
import { getAuthorization } from 'services/authorization';

interface Iprops {
	data: PosCustomer,
}

const CustomerItem: React.FC<Iprops> = props => {
	return <View style={styles.titleContainer}>
		<ShortBar style={styles.title} title="客户信息" />
		<InfoLayout title="客户名称：" content={props.data.name ? props.data.name : ''} />
		<InfoLayout
			title="证件类型："
			titlePartner={<Text style={commonStyle.tag}>身份证</Text>}
			content={props.data.idNumber ? props.data.idNumber : ''}
		/>
		<InfoLayout title="电话号码：" content={props.data.tell ? props.data.tell : ''} />
		<InfoLayout title="当前项目：" content={getAuthorization().project.name} />
	</View>
}


interface CustomerItemStyle {
	titleContainer: ViewStyle
	title: ViewStyle
}


const styles = StyleSheet.create<CustomerItemStyle>({
	titleContainer: {
		flexDirection: 'column',
		paddingTop: translateSize(43),
		marginBottom: translateSize(30),
		backgroundColor: definedColors.white,
	},
	title: {
		width: '50%',
		paddingLeft: translateSize(30),
	}
})

export default CustomerItem;